// 首页轮播图区域
import React,{Component} from 'react';
import { View, Text, StyleSheet, Dimensions, Image } from 'react-native';
import Ionicons from 'react-native-vector-icons/Ionicons';

class Flash extends Component{
    render() {
        return (

        <View style={styles.flash}>
            <Image source={require('../../images/banner.jpg')} style={styles.flashpic} />
            <View style={styles.city}>
                <Text style={styles.cityname}>北京</Text>
                <Ionicons
                    name={'ios-water'}
                    size={16}
                />
            </View>
        </View>

        )
    }
}

// 获得屏幕宽度
let swidth = Dimensions.get('window').width;

let styles = StyleSheet.create({
    flash:{
        width:swidth,
        height:swidth*512/1024,
        backgroundColor:'yellow',
        position:'relative',
    },
    flashpic:{
        width:swidth,
        height:swidth*512/1024,
    },
    city:{
        position:'absolute',
        backgroundColor:'rgba(255,255,255,0.6)',
        width:'16%',
        height:28,
        left:'42%',
        top:20,
        justifyContent:'center',
        alignItems:'center',
        borderRadius:13,
        flexDirection:'row',
    },
    cityname:{
        marginRight:5,
    },

})


export default Flash;

